//创建一个路由器，暴露出去
import { createRouter, createWebHistory } from 'vue-router'
import Home from '../components/Home.vue'
import History from '../components/History.vue'
import Ocr from '../components/Ocr.vue'
import CalligraphyLibrary from '../components/CalligraphyLibrary.vue'
import Collect from '../components/Collect.vue'
import DynamicStatic from '../components/DynamicStatic.vue'
import Show from '../components/Ocr/Show.vue'
import WorksCollection from '../components/Collect/WorksCollection.vue';
import CharacterCollection from '../components/Collect/CharacterCollection.vue';
import CalligrapherDetail from '../components/Library/CalligrapherDetail.vue'; // 书法家详情页面
import WorkDetail from '../components/Library/WorkDetail.vue'; 
import MultitextComparison from '../components/MultitextComparison.vue'
import CollectWord from '../components/CollectWord.vue'


const router = createRouter({
  history: createWebHistory(),
  routes: [{
    path: '/',
    component: Home
  },
  {
    path: '/history',
    component: History
  },
  {
    path: '/Ocr',
    component: Ocr
  },
  {
    path: '/calligraphylibrary',
    component: CalligraphyLibrary
  },
  {
    path: '/multitextcomparison',
    component: MultitextComparison
  },
  {
    path: '/collect',
    component: Collect,
    children: [
      {
        path: 'works', // 访问 /collect/works
        component: WorksCollection,
      },
      {
        path: 'character', // 访问 /collect/character
        component: CharacterCollection,
      },
    ],
  },
  {
    path: '/calligrapher/:id',
    name: 'CalligrapherDetail',
    component: () => import('@/components/Library/CalligrapherDetail.vue')
  },
  {
    path: '/work/:id',
    name: 'WorkDetail',
    component: () => import('@/components/Library/WorkDetail.vue')
  },
  {
    path: '/dynamicstatic',
    component: DynamicStatic
  },
  {
    path: '/show',
    name: 'Show',
    component: Show
  },
  {
    path: '/collectword',
    component: CollectWord
  },
  {
    path: '/character/:id',
    name: 'CharacterDetail',
    component: () => import('@/views/CharacterDetail.vue'),
    props: true,
    beforeEnter: (to, from, next) => {
      if (!to.params.image && to.query.image) {
        to.params.image = to.query.image as string;
      }
      next();
    }
  },
  {
    path: '/character/show/:id',
    name: 'CharacterShow',
    component: () => import('@/views/CharacterShow.vue')
  },
  ],
})

export default router